{% extends "base.html" %}

{% block headtitle %}Role Details - {{ role }}{% endblock %}



{% block header_scripts %}
<link rel="stylesheet" type="text/css" media="screen,projection,print" href="/m/css/jquery.dataTables.css" />
<link rel="stylesheet" type="text/css" media="screen,projection,print" href="/m/css/jquery.cluetip.css" />

<script type="text/javascript" src="/m/js/lib/jquery.cluetip.js"></script>
<script type="text/javascript" src="/m/js/lib/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/m/js/lib/jquery.jeditable.js"></script>


<script type="text/javascript">
DIRECTOR_ACCESS_LVL = {{ directorAccessLvl }};
COLOR_THRESHOLDS = {{ colorThresholds|safe }};
AJAX_URL = "/roles/{{ role.roleType.typeName }}/{{ role.roleID }}/data";
COOKIE_NAME = 'ecm_role_members_table_';

$(document).ready(function() {
    $("#access_level_box").editable( '/roles/update', {
        "callback": function( sValue, y ) {
            $("#access_level_box").text(sValue);
            $("#access_level_box").attr("class", "bold row-" + getAccessColor(parseInt(sValue), COLOR_THRESHOLDS));
        },
        "submitdata": function ( value, settings ) {
            return { "id": {{ role.id }} };
        }
    } );

    $("#access_level_box").addClass(
            "row-" + getAccessColor(parseInt($("#access_level_box").text()), COLOR_THRESHOLDS)
    );
});
</script>

<script type="text/javascript" src="/m/js/members_table.js"></script>


{% endblock %}


{% block breadcrumbs %}
<li><a href="/">Home</a></li>
<li><a href="/roles">Roles</a></li>
<li><a href="/roles/{{ role.roleType.typeName }}">{{ role.roleType.dispName }}</a></li>
<li><a href="/roles/{{ role.roleType.typeName }}/{{ role.roleID }}">{{ role.name }}</a></li>
{% endblock %}

{% block main_content %}
<h1 class="pagetitle">{{ role }}</h1>

<p class="italic">{{ role.description }}</p>

<h1>Access Level</h1>

<table class="table" >
  <tr class="row">
    <td class="bold" id="access_level_box" title="Click to edit...">{{ role.accessLvl }}</td>
  </tr>
</table>



<h1>Members having the role <i>{{ role }}</i></h1>

<ul>
  <li>
    <b>Assigned directly:</b>
    {% if direct_member_count %}
    {{ direct_member_count }} member{{ direct_member_count|pluralize }}
    {% else %}
    None
    {% endif %}
  </li>
  <li>
    <b>Assigned through titles:</b>
    {% if total_member_count %}
    {{ total_member_count }} member{{ total_member_count|pluralize }}
    {% else %}
    None
    {% endif %}
  </li>
</ul>

<form id="search_form" class="search_form">
    <input type="text" id="search_text" value="" />
    <input type="button" class="button" id="search_button" value="Search" />
    <input type="button" class="button" id="clear_search" value="Reset" />
</form>

<table class="table display" id="members_table">
  <thead>
    <tr>
      <th class="top" scope="col" >Name</th>
      <th class="top" scope="col" >Nickname</th>
      <th class="top" scope="col" >Player</th>
      <th class="top" scope="col" >Access Level</th>
      <th class="top" scope="col" >Corp Date</th>
      <th class="top" scope="col" >Last Login</th>
      <th class="top" scope="col" >Location</th>
      <th class="top" scope="col" style="display:none;">Titles</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td colspan="8" class="dataTables_empty">Loading data from server...</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th>Name</th>
      <th>Nickname</th>
      <th>Player</th>
      <th>Access Level</th>
      <th>Corp Date</th>
      <th>Last Login</th>
      <th>Location</th>
      <th style="display:none;">Titles</th>
    </tr>
  </tfoot>

</table>

{% endblock %}
